/**
 * imgnotes jQuery plugin
 * version 0.1
 *
 * Copyright (c) 2008 Dr. Tarique Sani <tarique@sanisoft.com>
 *
 * Dual licensed under the MIT (MIT-LICENSE.txt) 
 * and GPL (GPL-LICENSE.txt) licenses.
 *
 * @URL      http://www.sanisoft.com/blog/2008/05/26/img-notes-jquery-plugin/
 * @Example  example.html
 *
 **/

	function appendnote(note_data){
		note_left  = parseInt(imgOffset.left) + parseInt(note_data.x1);
		note_top   = parseInt(imgOffset.top) + parseInt(note_data.y1);
		note_p_top = note_top + parseInt(note_data.height)+5;
						
		note_area_div = $("<div id='enlazar-"+note_data.uuid+"' class='note ui-corner-all'></div>").css({ left: note_left + 'px', top: note_top + 'px', width: note_data.width + 'px', height: note_data.height + 'px' });
		note_area_div.hover(
			function(){
				$('#lista-'+note_data.uuid).addClass("ui-state-highlight");
			},
			function(){
				$('#lista-'+note_data.uuid).removeClass("ui-state-highlight");
			});
			
		
		note_text_div = $('<div id="enlazarp-'+note_data.uuid+'" class="notep enlazar-'+note_data.uuid+' ui-helper-reset ui-corner-all" >'+note_data.note+'</div>').css({ left: note_left + 'px', top: note_p_top + 'px'});
	
		//Inserta en la lista de etiquetados
		var usuarioLista = $("<div>");
		var usuarioLink = $("<a>");
		usuarioLink.text(note_data.nombre);
		usuarioLink.attr("href","#perfil&uuid="+note_data.uuid);
		usuarioLink.attr("id","lista-"+note_data.uuid);
		usuarioLink.addClass("ui-helper-reset");
		usuarioLink.hover(
			function(){
				$('#enlazar-'+note_data.uuid).show();
				$('#enlazarp-'+note_data.uuid).show();
				$(this).addClass("ui-state-highlight");
			},
			function(){
				$('#enlazar-'+note_data.uuid).hide();
				$('#enlazarp-'+note_data.uuid).hide();
				$(this).removeClass("ui-state-highlight");
			}
		);
		
		usuarioLista.append(usuarioLink);
		
		$("#listaEtiquetados").append(usuarioLista);
		$('body').append(note_area_div);
		if(note_data.note.length > 0)
			$('body').append(note_text_div);
	}
	
//Wrap in a closure
(function($) {

	$.fn.imgNotes = function(n) {
		image = this;

		imgOffset = $(image).offset();
	
		if(undefined != n)
			$(n).each(function(){
				appendnote(this);
			});	
	
		$(image).hover(
			function(){
				$('.note').show();
				$('.notep').show();
			},
			function(){
				$('.note').hide();
				$('.notep').hide();
			}
		);
addnoteevents();
		
		
		/*$(window).resize(function () {
			$('.note').remove();

			imgOffset = $(image).offset();

			$(notes).each(function(){
				appendnote(this);				
			});
addnoteevents();
			

		});*/
	} 
	
function addnoteevents() {
		$('.note').hover(
			function(){
				$('.note').show();
				
				$(this).next('.notep').css("z-index", 10000);
			}
		);
	}



// End the closure
})(jQuery);
